<template>
  <div class="news">
    <div class="menu">
      <div class="header">
        <h4>标题</h4>
        <h4>更新公告</h4>
      </div>
      <div class="title">
        <div class="time">
          <span>发布时间:</span>
          <span>{{ info.messPublishtime }}</span>
        </div>
        <div>
          <span>操作人:</span>
          <span class="name">{{ info.messDistribute }}</span>
        </div>
      </div>
      <div class="txt">{{ info.messConfirmed }}</div>
      <div class="foot">
        <div>
          <span>操作人名字:</span><span>{{ info.messDistribute }}</span>
        </div>
        <div>
          <span>{{ info.messPublishtime }}</span>
        </div>
      </div>
      <div class="close">
        <el-button size="mini" @click="closeBtn">关闭</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import router from "@/router";
export default {
  name: "News",
  created() {
    console.log(this.$route.query.data);
    this.info = this.$route.query.data;
  },
  data() {
    return {
      info: {},
    };
  },
  methods: {
    closeBtn() {
      router.replace({ path: "touristlist" });
    },
  },
};
</script>

<style scoped lang='scss'>
.news {
  width: 100%;
  padding: 10px 0;
  box-sizing: border-box;
  .menu {
    width: 50%;
    padding: 10px 0;
    box-sizing: border-box;
    margin: 0 auto;
    border: 1px solid rgb(157, 229, 241);
    border-radius: 5px;
    background-color: rgb(182, 238, 251);
    .header {
      display: flex;
      padding: 0 10px;
      box-sizing: border-box;
      h4 {
        margin-right: 40px;
      }
    }
    .title {
      display: flex;
      margin: 10px 0;
      padding: 0 10px;
      box-sizing: border-box;
      font-size: 14px;
      .time {
        margin-right: 80px;
        span {
          margin-right: 20px;
        }
      }
      .name {
        color: red;
        margin-left: 20px;
      }
    }
    .txt {
      margin-top: 10px;
      padding: 10px;
      font-size: 12px;
      box-sizing: border-box;
      border-top: 1px solid;
    }
    .foot {
      margin: 40px 40px;
      box-sizing: border-box;
      font-size: 14px;
      text-align: right;
      div {
        margin-top: 5px;
        span {
          margin-right: 10px;
        }
      }
    }
    .close {
      text-align: center;
    }
  }
}
</style>